<!DOCTYPE html>
<html>
<head>
	<title>{$store_title}</title>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
	<script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js" type="text/javascript"></script>
	<link rel="stylesheet" href="/public/mobile/css/common.css">
	<link rel="stylesheet" href="/public/mobile/css/index.css">
	<style>#bgImg{position: absolute;top:0;left:0;width:100vw;height:100vh;z-index:-2;}</style>
</head>
<body class="index_bg">
<img src="/public/mobile/img/index_bg.png" id="bgImg" alt="">
<img src="/public/mobile/img/brain.png" class="move" alt="">
<img src="/public/mobile/img/torch_txt.png" class="index_text" alt="">
<div class="pop_box hide">
    <img src="/public/mobile/img/index_pop.png" class="pop_bg">
    <img src="/public/mobile/img/index_page.png" class="pop_btn hide">
	<div class="text_box">
	</div>
</div>
<audio src="/public/mobile/audio/move.mp3" preload="auto" id="BGmusic"></audio>
<audio src="/public/mobile/audio/text.mp3" preload="auto" id="textMove"></audio>
<script src="/public/mobile/js/jquery.min.js"></script>
<script src="/public/mobile/js/public.js"></script>
<script>
    showLoadMask=function(){
        var html='<div class="mask_load" id="maskLoad"><div class="mask_load_box"><div class="spinner"><div class="dot1"></div><div class="dot2"></div></div></div></div>'
        $("body").append(html)
    }
   hideLoadMask=function(){
        $("#maskLoad").remove();
    }
    $(document).ready(function(){
        var u = navigator.userAgent;
        var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
        ///if(isiOS){
            document.body.addEventListener('touchmove', function (e) {
                e.preventDefault(); //阻止默认的处理方式(阻止下拉滑动的效果)
            }, {passive: false});
        //}
    });
	function moveOffset(elem,top,left) {
	    var obj={top:top+"%",left:left+"%"};elem.css(obj);
    }
    //头像移动的距离计算
    function step1() {
        setTimeout(function () {
            moveTop=moveTop+0.2;
            if(moveTop>=21.00){
                step1Circle()
            }else{
                step1()
            }
            moveOffset(move,moveTop,moveLeft)

        },speed)
    }
    function  step1Circle() {
        setTimeout(function () {
            moveLeft=moveLeft-0.2;
            moveTop=moveTop+0.1;
            moveLeft<43.00?step2():step1Circle()
            moveOffset(move,moveTop,moveLeft)
        },speed)
    }
    function step2() {
        setTimeout(function () {
            moveLeft=moveLeft-0.2;
            moveTop=moveTop>23.40?moveTop:(moveTop+0.1);
            if(moveLeft<=21.00){
                step2Circle()
            }else{
                step2()
            }
            moveOffset(move,moveTop,moveLeft)
        },speed)
    }
    function step2Circle(){
        setTimeout(function () {
            moveLeft=moveLeft-0.3;
            moveTop=moveTop+0.15;
            moveLeft<=15.80?step3():step2Circle()
            moveOffset(move,moveTop,moveLeft)
        },speed)
    }
    function step3(){
         setTimeout(function () {
            moveLeft=moveLeft-0.15;
            moveTop=moveTop+0.1;
            moveLeft<=15.80?step4():step2Circle()
            moveOffset(move,moveTop,moveLeft)
        },speed)
    }
    function step4(){
        setTimeout(function () {
            moveTop=moveTop+0.1;
            moveTop>=34.00?setTimeout(step41,1000):step4()
            moveOffset(move,moveTop,moveLeft)
        },speed)
    }
    function step41(){
        setTimeout(function () {
            moveTop=moveTop+0.1;
            moveTop>=40.00?step4Circle():step41()
            moveOffset(move,moveTop,moveLeft)
        },speed)
    }
    function step4Circle(){
        setTimeout(function () {
            moveTop=moveTop>43?moveTop:moveTop+0.15;
            moveLeft=moveLeft+0.08;
            moveLeft>=18.00?step5():step4Circle()
            moveOffset(move,moveTop,moveLeft)
        },speed)
    }
    function step5(){
        setTimeout(function () {
            moveTop=moveTop>43?moveTop:moveTop+0.15;
            moveLeft=moveLeft+0.112;
            moveLeft>=31.50?step5Circle():step5()
            moveOffset(move,moveTop,moveLeft)
        },speed)
    }
    function step5Circle(){
         setTimeout(function () {
            moveTop=moveTop>46?moveTop:moveTop+0.15;
            moveLeft=moveLeft+0.2;
            (moveLeft>35&&moveTop>46)?setTimeout(function () {
                textChange();
            },400):step5Circle();
            moveOffset(move,moveTop,moveLeft)
        },speed)
    }
    //第三站文字大小变化
    function textChange(){
        $(".index_text").animate({width:"11.7rem"},300,function(){
            $(".index_text").animate({width:"10rem"},300,function () {
                $(".pop_box").removeClass("hide");
				var bgMusic = document.getElementById("BGmusic");
				var textVoice = document.getElementById("textMove");
                var u = navigator.userAgent;
                var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
                var animateDelay=isiOS?1800:200;
                if (window.WeixinJSBridge) {
					WeixinJSBridge.invoke('getNetworkType', {}, function (e) {
                        bgMusic.pause();textVoice.play();
					    setTimeout(function () {
							textMove();
						},animateDelay)
					}, false);
				} else {
					document.addEventListener("WeixinJSBridgeReady", function () {
						WeixinJSBridge.invoke('getNetworkType', {}, function (e) {
                            bgMusic.pause();textVoice.play();
						    setTimeout(function () {
								textMove();
							},animateDelay)
						});
					}, false);
				}

            })
        })
    }
    //文字自动输入
	var boxText="2019年上校爷爷带你“耍”西南已经来到第三站火把节，要把火把节的火热传遍全国！西南的火辣热情等你绽放，上校爷爷带你一起尽情狂欢！";
	var textNum=0,textLength=boxText.length,textTap=true;
	function textMove() {
		setTimeout(function () {
            textNum=textNum+1;
            if(textNum<=textLength&&textTap){
                var text=boxText.substring(0,textNum);
                $(".text_box").text(text)
                textMove()
				if(textNum==textLength){
                    setTimeout(function () {
                        $(".pop_btn").removeClass("hide");
                        var textVoice = document.getElementById("textMove");
                        textVoice.pause()
                    },200)
				}
			}
        },100)
    }
    //弹出框点击事件
	$(".pop_box").on("touchstart",".text_box",function () {
		$(".text_box").text(boxText);textTap=false;
        setTimeout(function () {
            $(".pop_btn").removeClass("hide");
            var textVoice = document.getElementById("textMove");
            textVoice.pause()
        },200)
    }).on("touchstart",".pop_btn",function () {
		location.href="/mobile/index/login.html"
    })
    //var moveTop=46,moveLeft=35.562;
    var move=$(".move"),speed=5;
    var moveTop=14.00,moveLeft=47.00;
	$().ready(function () {
        var width=document.body.clientWidth;
        var height=document.body.clientHeight;
        if(height/width>=1.70){
			$("body").css("backgroundImage","url('/public/mobile/img/index_bgx.jpg')")
			$("#bgImg").attr("src","/public/mobile/img/index_bgx.png");
        }
        showLoadMask()
        setTimeout(function () {
            var u = navigator.userAgent;
            var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
            var animateDelay=isiOS?2000:200;
            if (window.WeixinJSBridge) {
                hideLoadMask()
                WeixinJSBridge.invoke('getNetworkType', {}, function (e) {
                    var audio = document.getElementById("BGmusic");
                    audio.play();
                    setTimeout(function () {
                        moveOffset(move,moveTop,moveLeft);
                        step1();
                    },animateDelay)
                }, false);
            } else {
                document.addEventListener("WeixinJSBridgeReady", function () {
                    WeixinJSBridge.invoke('getNetworkType', {}, function (e) {
                        var audio = document.getElementById("BGmusic");
                        audio.play();
                        setTimeout(function () {
                            hideLoadMask()
                            moveOffset(move,moveTop,moveLeft);
                            step1();
                        },animateDelay)
                    });
                }, false);
            }


        },1500)
    })
</script>
<script>
    // 微信配置
    wx.config({
        debug: false,
        appId: "{$signPackage['appId']}",
        timestamp: '{$signPackage["timestamp"]}',
        nonceStr: '{$signPackage["nonceStr"]}',
        signature: '{$signPackage["signature"]}',
        jsApiList: [
            'checkJsApi',
            'onMenuShareTimeline',
            'onMenuShareAppMessage',
            'onMenuShareQQ',
            'onMenuShareQZone']
        // 功能列表，我们要使用JS-SDK的什么功能
    });

    //  var ShareLink = "http://{$_SERVER['HTTP_HOST']}"; //默认分享链接
    var ShareLink = "{$data_share['link']}"; //默认分享链接
    var ShareImgUrl ="{$data_share['imgUrl']}"; // 分享图标
    // config信息验证后会执行ready方法，所有接口调用都必须在config接口获得结果之后，config是一个客户端的异步操作，所以如果需要在 页面加载时就调用相关接口，则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口，则可以直接调用，不需要放在ready 函数中。
    wx.ready(function(){
        // 获取"分享到朋友圈"按钮点击状态及自定义分享内容接口
        wx.onMenuShareTimeline({
            title: " {$data_share['title']}", // 分享标题
            link:ShareLink,
            imgUrl:ShareImgUrl ,// 分享图标
            success: function () {

            },
            cancel: function () {

            }
        });

        // 获取"分享给朋友"按钮点击状态及自定义分享内容接口
        wx.onMenuShareAppMessage({
            title: "{$data_share['title']}", // 分享标题
            desc: "{$data_share['desc']}", // 分享描述
            link:ShareLink,
            imgUrl:ShareImgUrl ,// 分享图标
            success: function () {

            },
            cancel: function () {

                // 用户取消分享后执行的回调函数
            }
        });
        // 分享到QQ
        wx.onMenuShareQQ({
            title: "{$data_share['title']}", // 分享标题
            desc: "{$data_share['desc']}", // 分享描述
            link:ShareLink,
            imgUrl:ShareImgUrl ,// 分享图标
            success: function () {

            },
            cancel: function () {

            }
        });
        // 分享到QQ空间
        wx.onMenuShareQZone({
            title: "{$data_share['title']}", // 分享标题
            desc: "{$data_share['desc']}", // 分享描述
            link:ShareLink,
            imgUrl:ShareImgUrl ,// 分享图标
            success: function () {

            },
            cancel: function () {

            }
        });
    });
</script>
<script>
    var _mtac = {};
    (function() {
        var mta = document.createElement("script");
        mta.src = "//pingjs.qq.com/h5/stats.js?v2.0.4";
        mta.setAttribute("name", "MTAH5");
        mta.setAttribute("sid", "500690473");
        var s = document.getElementsByTagName("script")[0];
        s.parentNode.insertBefore(mta, s);
    })();
</script>
</body>
</html>